<template>
  <uni-nav-bar title="商品核销" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
  <view class="package space-between search" style="padding:0px 0px 0px 20rpx">
    <input class="uni-input" placeholder="请输入兑换码" v-model="search" />
    <text @click="init()">查询</text>
  </view>
  <view class="package space-between" v-if="inFor">
    <image :src="inFor.image" mode=""></image>
    <view class="direction-start illustrate">
      <view style="color:#333;font-size: 30rpx;">{{inFor.name}}</view>
      <!-- <view style="height:60rpx;">福利券说明</view>
      <view>有效期：2023-12-24</view> -->
    </view>
  </view>
  <view class="package space-between" style="color:#666;" v-if="inFor">
    <view>用户</view>
    <view>{{inFor.driver_name}}</view>
  </view>
  <view class="package space-between" style="color:#666;" v-if="inFor">
    <view>兑换时间</view>
    <view>{{inFor.createtime}}</view>
  </view>
  <view class="but" @click="submit()" :style="{background:show?'linear-gradient(-10deg, #2C96F9, #1B91FF)':'#999'}">确认发货
  </view>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import { navBack, redirectTo } from '@/utils/navigator';
  import { onLoad } from '@dcloudio/uni-app';
  import { toPublish, publish } from '@mqtt';
  import { getHexiaoInfo } from '@/gql/welfareVoucher';
  import { useUserStore } from '@/stores/user';
  import { showLoading, errorToast, successToast } from '@/utils/prompt';
  const userInfo = useUserStore();
  const search = ref()
  const inFor = ref()
  const show = ref(true)
  onLoad((pearm) => {
    if (pearm.str) {
      search.value = pearm.str
      init()
    }
  })
  function init() {
    showLoading()
    const payload = {
      query: getHexiaoInfo,
      variables: {
        code: search.value,
        store_id: userInfo.store_id,
      },
    };
    toPublish(
      'ql/store/getHexiaoInfo',
      payload,
      (obj : any) => {
        uni.hideLoading();
        const { getHexiaoInfo } = obj.data;
        if (getHexiaoInfo.name) {
          inFor.value = getHexiaoInfo
        } else {
          show.value = false
          errorToast('您不是当前商家身份')
          return
        }
      }
    );
  }
  function submit() {
    if (!show.value) {
      return
    }
    showLoading()
    const payload = {
      order_id: inFor.value.id,
      store_id: userInfo.store_id,
    };
    toPublish(
      'store/doFahuo',
      payload,
      (obj : any) => {
        const { code, msg } = obj;
        if (code === 1) {
          successToast(msg)
          writeOff()
          setTimeout(() => {
            redirectTo('welfareVoucher/goodsList')
          }, 600)
        } else {
          errorToast(msg)
        }
      }
    );
  }
  function writeOff() {
    const payload = {
      type: 'success',
    };
    const topic = 'formal/v1/integral/Verification/client/' + search.value
    publish(topic, payload)
  }
</script>
<style scoped lang="less">
  .package {
    image {
      width: 142rpx;
      height: 142rpx;
      // background: #FF7B48;
      border-radius: 10rpx;
    }

    .illustrate {
      width: 76%;
      font-size: 24rpx;
      color: #666666;
      height: 142rpx;
      justify-content: space-between;
    }
  }

  .search {
    input {
      width: 550rpx;
      height: 88rpx;
    }

    text {
      width: 144rpx;
      height: 88rpx;
      background: #3F90FF;
      border-radius: 10rpx;
      color: #fff;
      text-align: center;
      line-height: 88rpx;
    }
  }

  .but {
    width: 480rpx;
    height: 100rpx;
    border-radius: 5px;
    text-align: center;
    line-height: 100rpx;
    color: #fff;
    margin: 180rpx auto 0px;
    font-size: 32rpx;
  }

  .top {
    margin-top: 15rpx;
  }
</style>